var QuickView = {
    config : {
        id:"qv",
        urlajax:''
    },
    init : function(urlAjax){
        QuickView.config.urlAjax = urlAjax;
        var     htmlInit = '<div id="wrap_qv" style="display:none;">';
        htmlInit += '</div>';
        htmlInit += '<div id="data_qv" style="display: none;"></div>';
        htmlInit += '<div id="'+QuickView.config.id+'" class="hidden" style="position: absolute">';
        htmlInit += '<div class="loading" style="position: absolute;z-index:1000001;text-align:center; top:0px;left:0px;width:865px;height:580px;background:#EEE;display:none;">';
        htmlInit += 	'<p style="color:black;font-family:Helvetica;font-size:18px;margin-top:130px;text-align:center;">';
        htmlInit += 		'<img width="16" height="16" style="vertical-align: bottom;"  id="loading-graphic" src="/images/ajax-loader-eeeeee.gif">';
        htmlInit += 		'Loading...';
        htmlInit += 	'</p>';
        htmlInit += '</div>';
        //			htmlInit += '<i class="arrow-up"></i>';
        htmlInit += '<a href="javascript:void(0);" onclick="jQuery(\'#'+QuickView.config.id+'\').fadeOut(300);jQuery(\'#wrap_qv\').fadeOut(100);" class="close-qv">';
        //			htmlInit += 	'Close &nbsp;';
        htmlInit += 	'<i class="cl"></i>';
        htmlInit += '</a>';
        htmlInit += '<a href="javascript:void(0)" onclick="QuickView.nextView()" class="next-product-qv"></a>';
        htmlInit += '<a href="javascript:void(0)" onclick="QuickView.prevView()" class="prev-product-qv"></a>';
        htmlInit += '<div id="qv-content"><div class="content-left-border"></div>' + QuickView.template() + '</div></div>';			
        jQuery('body').append(htmlInit);											
        //		jQuery('.image-wrapper').hover(function(){
        //			jQuery(this).find("a.btn-qv").removeClass('hidden');		
        //		}, function(){
        //			jQuery(this).find("a.btn-qv").addClass('hidden');					
        //		}); 
                
        jQuery('#wrap_qv').live('click',function(){
            jQuery('#' + QuickView.config.id).fadeOut(400);
            jQuery('#wrap_qv').fadeOut(400);
        });
                
        jQuery('body').keyup(function(e){
            if(e.which == 27){
                jQuery('#' + QuickView.config.id).fadeOut(300);
                jQuery('#wrap_qv').fadeOut(400);
            }
            if(e.which == 39){
                QuickView.nextView();
            }
            if(e.which == 37){
                QuickView.prevView();
            }
            if(e.which == 13){
                jQuery('#btn-view-detail').click();
            }
        });
    },
    viewBox : function(event,product_id){            
        QuickView.addOverLay();
        jQuery('#' + QuickView.config.id + ' .loading').show();                		
        jQuery('#' + QuickView.config.id).fadeIn(100);
        if(jQuery('#' + QuickView.config.id).data(product_id)){
            var data = jQuery('#' + QuickView.config.id).data(product_id);
            QuickView.updateData(data);
        }else{
            QuickView.ajaxLoad(product_id);
        }
        QuickView.detectWindow(event);
    },
    nextView : function(){
        var aryId = jQuery("#data_qv").data("ary_id");
        var product_id = jQuery("#data_qv").data("next_qv");
        if(jQuery('#' + QuickView.config.id).data(product_id)){
            var data = jQuery('#' + QuickView.config.id).data(product_id);
            QuickView.updateData(data);
        }else{
            QuickView.ajaxLoad(product_id);
        }
        var totalProduct = aryId.length;
        for(i in aryId){
            if(product_id == aryId[i]){
                returnValue = i;
            }
        }
        if(returnValue == 0){
            jQuery('.prev-product-qv').addClass('hidden');
            jQuery('.next-product-qv').removeClass('hidden');
        } else if(returnValue == (parseInt(totalProduct)-1)){
            jQuery('.next-product-qv').addClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        } else{
            jQuery('.next-product-qv').removeClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        }
        var returnValueNext = parseInt(returnValue)+1;
        var returnValuePrev = parseInt(returnValue)-1;
        jQuery('#data_qv').data('next_qv',aryId[returnValueNext]);
        jQuery('#data_qv').data('prev_qv',aryId[returnValuePrev]);
    },
    prevView : function(){
        var aryId = jQuery("#data_qv").data("ary_id");
        var product_id = jQuery("#data_qv").data("prev_qv");
        if(jQuery('#' + QuickView.config.id).data(product_id)){
            var data = jQuery('#' + QuickView.config.id).data(product_id);
            QuickView.updateData(data);
        }else{
            QuickView.ajaxLoad(product_id);
        }
        var totalProduct = aryId.length;
        for(i in aryId){
            if(product_id == aryId[i]){
                returnValue = i;
            }
        }
        if(returnValue == 0){
            jQuery('.prev-product-qv').addClass('hidden');
            jQuery('.next-product-qv').removeClass('hidden');
        } else if(returnValue == (parseInt(totalProduct)-1)){
            jQuery('.next-product-qv').addClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        } else{
            jQuery('.next-product-qv').removeClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        }
                
        var returnValueNext = parseInt(returnValue)+1;
        var returnValuePrev = parseInt(returnValue)-1;
        jQuery('#data_qv').data('next_qv',aryId[returnValueNext]);
        jQuery('#data_qv').data('prev_qv',aryId[returnValuePrev]);
    },
    getListId : function(event, product_id, view){
        var aryId = new Array();
        if(view == 'gr4_2_bgcenter'){
            jQuery(event).parents('.content').children('.product-internal-grid').each(function(){
                jQuery(this).each(function(){
                    jQuery(this).children().each(function(){
                        aryId.push(jQuery(this).attr('name'));
                    });                        
                });
            });
        } else if(view == 'list_horizontal'){
            jQuery(event).parents('ul').children().each(function(){
                aryId.push(jQuery(this).attr('name'));
            });
        } else if(view == 'product_row'){
            jQuery(event).parents('.content').children('.product-row').each(function(){
                jQuery(this).each(function(){
                    jQuery(this).children().each(function(){
                        aryId.push(jQuery(this).attr('name'));
                    });                        
                });
            });
        } else if(view == 'item_view'){
            jQuery(event).parents('.items').children('.item-product').each(function(){
                aryId.push(jQuery(this).attr('name'));
            });
        }
        var totalProduct = aryId.length;
        var returnValue = 0;
        for(i in aryId){
            if(product_id == aryId[i]){
                returnValue = i;
            }
        }
        if(returnValue == 0){
            jQuery('.prev-product-qv').addClass('hidden');
            jQuery('.next-product-qv').removeClass('hidden');
        } else if(returnValue == (parseInt(totalProduct)-1)){
            jQuery('.next-product-qv').addClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        } else{
            jQuery('.next-product-qv').removeClass('hidden');
            jQuery('.prev-product-qv').removeClass('hidden');
        }
        var returnValueNext = parseInt(returnValue)+1;
        var returnValuePrev = parseInt(returnValue)-1;
        jQuery('#data_qv').data('next_qv',aryId[returnValueNext]);
        jQuery('#data_qv').data('prev_qv',aryId[returnValuePrev]);
        jQuery('#data_qv').data('ary_id',aryId);
    },
    detectWindow:function(item){
        var widthWin = jQuery(window).width();
        var heightWin = jQuery(window).height();
        var offsetWin = jQuery(window).scrollTop();
        //var offset = jQuery(item).offset();							
        var widthQV = (jQuery('#qv').width())?jQuery('#qv').width():648;
        var top = (heightWin - 580)/2 + jQuery(window).scrollTop();
        var left = (widthWin-865)/2;				
        //var distanceTop = offset.top -  jQuery(window).scrollTop();	
        //top = (distanceTop > (heightWin/2 - 30)&&(distanceTop > 380))?(-380):top;
        //left = (offset.left < left)?(offset.left - 20):left;
        //left = ((widthWin-offset.left)<(widthQV-left+52))?(widthQV - widthWin + offset.left + 52): left;
        jQuery('#' + QuickView.config.id).css({
            'top' : top + 'px', 
            'left' : left +  'px'
            });
        if(top > 0){
            jQuery('#' + QuickView.config.id + ' .arrow-up').css({
                'left':left + 32 + 'px', 
                'background-position':'left top', 
                'top':'-9px'
            });
        }else{
            jQuery('#' + QuickView.config.id + ' .arrow-up').css({
                'left':left + 32 + 'px', 
                'background-position':'left bottom', 
                'top':'326px'
            });
        }
    },
    template : function(){
        var html='<div class="content-main">';
        html += '<div class="quick-views-left">';			
        html += 	'<div class="image-large">';
        html += 		'<!-- image large -->';
        html += 	'</div>';
        html += 	'<div class="image-small" id="list-mor-img">';		 	
        html += 			'<!-- image_small -->';			
        html += 	'</div>';
        html += '</div>';
        html += '<div class="quick-views-right">';
        //			html += 	'<ul>';
        //			html += 		'<li class="tabqv tab1 active" >Thông tin</li>';
        //			html += 		'<li class="tabqv tab2">Mô tả sản phẩm</li>';
        //			html += 	'</ul>';
        html += 	'<div style="clear: both;"></div>';
        html += 	'<div class="content">';
        html += 		'<div class="content-tab infor">';
        html += 			'<div class="row">';
        html += 					'<h4 style="color: #004b91; margin: 10px 0px;"><!-- product name --></h4>';
        html += 			'</div>';			
        html += 			'<div class="infor-general">';
        html += 				'<!-- infor -->';
        html += 			'</div>';
			
        html += 		'</div>';
        //			html += 		'<div class="content-tab short-description">';
        //			html += 			'<div class="row" style="margin-top: 12px">';
        //			html += 				'<label style="font-weight: bold; margin-bottom: 0px; width: 60px;">Mô tả: </label>';
        //			html += 				'<span class="des" style="text-align:justify;"><!-- short description --></span>';
        //			html += 			'</div>';			
        //			html += 		'</div>';
        html +=                 '<div id="add-to-cart" class="link-add-cart">';
        html += 			'<!-- infor cart -->';		 				
        html +=                 '</div>';
        html += 	'</div>';
        html += '</div>';
        html += '</div>';
        html +='<div class="content-right-border"></div>';
        html +='</div>';
        html += '<div class="quick-views-bottom">';
        html += '<a class="free-transport"><span class="light">Miễn phí </span>vận chuyển nội thành</a>';
        html += '<a class="pay-delivery"><span class="light">Thanh toán </span>khi nhận hàng</a>';
        html += '<a class="good-services"><span class="light">Cho phép trả hàng </span>trong 7 ngày</a>';
        html +='</div>';
        html += '<div class="clear"></div>';
        return html;			
    },
    ajaxLoad : function(product_id){
        jQuery.getJSON(QuickView.config.urlAjax,{
            'product_id':product_id
        }, function(data) {
            if(data['success']){
                jQuery('#' + QuickView.config.id).data(product_id,data)
                QuickView.updateData(data);
            }
        });	
    },
    updateData : function(data){
        var imageLarge = '';
        var imageSmall = '';
        var inforCart = '';
        var coutL = data['gallery']['large'].length;
        if(coutL>0){
            for(var i=0;i<coutL;i++){
                imageLarge += '<img class="img-lar" id="large_image_'+i+'" class="'+((i==0)? 'current' : '' )+'" src="'+data['gallery']['large'][i]+'" style="display: '+((i==0)?'inline' : 'none')+'" />';
            }			
        }
		
        var coutS = data['gallery']['small'].length;
        if(coutS>0){
            imageSmall += '<ul>';
            for(var i=0;i<coutS;i++){
                imageSmall += '<li>';
                imageSmall += '<a href="javascript:void(0);" rel="nofollow" class="small-img-link" id="image_'+i+'">';
                imageSmall += '<input type="hidden" value="'+i+'" />';
                imageSmall += '<img src="'+data['gallery']['small'][i]+'" alt="'+data['gallery']['name'][i]+'" style="" />';
                imageSmall += '</a>';
                imageSmall += '</li>';
            }
            imageSmall += '</ul>';
        }
		
        inforCart += '<input type="hidden" value="1" name="ajax">';
        inforCart += '<input type="hidden" value="'+data['product']['link_detail']+'" name="return_url">';
        if(data['status_type']==1){
            inforCart += '<div class="infor-contact">';
            inforCart += '<p>Nếu gặp khó khăn trong việc mua hàng<br/>Xin hãy gọi điện để nhận được tư vấn:</p>';
            inforCart += '<div class="ico-phone-qv"></div>';
            inforCart += '<div class="hotline">'+data['product']['hotline']+'</div>';
            inforCart += '<div class="clear"></div>';
            inforCart += '</div>';
            inforCart += '<a href="javascript:void(0)" title="Chi tiết sản phẩm" class="ajax_addcart button-grey" id="btn-view-detail" onclick="return QuickView.viewDetail(\''+data['product']['link_detail']+'\')"><span>Xem chi tiết</span></a>';
            inforCart +='<form name="addtocart" id ="productAddToCartForm" method="post" action="'+data['product']['link_addcart']+'">';
            inforCart += '<input type="hidden" id="link_add_to_cart" value='+data['product']['link_addcart']+'>';
            inforCart += '<div class="link-add-cart" id="Buynow">';
            inforCart +=           '<a title="Click mua ngay" class="button-add-to-cart" href="javascript:addtocartqv();" >';
            inforCart +=        '</a>';
            inforCart +=        '<input type="hidden" name="is_buy_now" value="0">';
            inforCart +=        '<input type="hidden" name="return_url" value="">';
            inforCart +=        '<input type="hidden" name="qty-item" value="">';
            inforCart +=    '</div>';
            inforCart +=    '</form>';

        }
		
		
        jQuery('#' + QuickView.config.id + ' .quick-views-left .image-large').html("<a href='"+data['product']['link_detail']+"'>"+imageLarge+"</a>");
        jQuery('#' + QuickView.config.id + ' .quick-views-left .image-small').html(imageSmall);
        jQuery('#' + QuickView.config.id + ' .quick-views-right .content .infor .infor-general').html(data['product']['infor']);
        jQuery('#' + QuickView.config.id + ' .quick-views-right .content #add-to-cart').html(inforCart);
        jQuery('#' + QuickView.config.id + ' .quick-views-right .content .infor .row h4').html("<a href='"+data['product']['link_detail']+"'>"+data['product']['name']+"</a>");
        //		jQuery('#' + QuickView.config.id + ' .quick-views-right .short-description span.des').html(data['product']['short_description']);
		
        QuickView.reloadJs();
        QuickView.show();
    },
    addOverLay : function(){
        jQuery('#wrap_qv').fadeIn(100);
    },
    reloadJs : function(){
        jQuery('#' + QuickView.config.id + ' .image-small').carouselcus({
            loop: true , 
            dispItems: 4, 
            animSpeed: 300, 
            nextBtn: '<a href="javascript:void(0);"></a>', 
            prevBtn:'<a href="javascript:void(0);"></a>'
        });
        jQuery('#' + QuickView.config.id + ' .small-img-link').click(function(){
            jQuery('#' + QuickView.config.id + ' .img-lar').hide();		
            jQuery('#' + QuickView.config.id + ' #large_'+jQuery(this).attr('id')).show();				
        });						
        jQuery('#' + QuickView.config.id + ' .quick-views-right ul .tabqv').removeClass('active');
        jQuery('#' + QuickView.config.id + ' .quick-views-right ul .tab1').addClass('active');
    //		jQuery('#' + QuickView.config.id + ' .quick-views-right .content .content-tab').addClass('hidden');
    //		jQuery('#' + QuickView.config.id + ' .quick-views-right .content .infor').removeClass('hidden');				
    },
    show : function(){				
        jQuery('#' + QuickView.config.id + ' .loading').hide();                                
    },
    addCart : function(url){
        location.href = url;
    },
    viewDetail : function(url){
        location.href = url;
    }
};

//<?php echo $this->createUrl('checkout/cart', array('product_id' => $product->id, 'redirect' => false, 'render' => 'formaddtocart')) ?>
  